<style lang="less">
    @import "./home.less";
    @import "../../styles/common.less";
</style>
<template>
    <div class="home-main">
        <Row>
            <!-- <Col span="6">
            <infor-card
                    id-name="user_created_count"
                    :end-val="count.createUser"
                    iconType="android-person-add"
                    color="#2d8cf0"
                    :intro-text="staffTotal"
            ></infor-card>
            </Col>
            <Col span="6" class-name="padding-left-5">
            <infor-card
                    id-name="visit_count"
                    :end-val="count.visit"
                    iconType="ios-eye"
                    color="#64d572"
                    :iconSize="50"
                    intro-text="今日人流量"
            ></infor-card>
            </Col>
            <Col span="6" class-name="padding-left-5">
            <infor-card
                    id-name="collection_count"
                    :end-val="count.collection"
                    iconType="upload"
                    color="#ffd572"
                    intro-text="今日访客量"
            ></infor-card>
            </Col> -->
            <Col span="6">
            <infor-card
                    id-name="user_student_count"
                    :end-val="count.todayStudent"
                    iconType="android-person-add"
                    color="#2d8cf0"
                    :intro-text="studentTotal"
            ></infor-card>
            </Col>
            <Col span="6" class-name="padding-left-5">
            <infor-card
                    id-name="transfer_count"
                    :end-val="count.transfer"
                    icon-type="shuffle"
                    color="#f25e43"
                    intro-text="今日陌生人流量"
            ></infor-card>
            </Col>
        </Row>
        <card class="margin-top-10">
            <div style="height: 390px">
                <LineCharts></LineCharts>
            </div>
        </card>
    </div>
</template>

<script>
    import countUp from './components/countUp.vue';
    import inforCard from './components/inforCard.vue';
    import LineCharts from './components/LineCharts'
    import {stat} from "../../controllers/record";
    import Card from "iview/src/components/card/card";

    export default {
        name: 'home',
        components: {
            Card,
            countUp,
            inforCard,
            LineCharts
        },
        data() {
            return {
                staffTotal: '已到员工数，共0人',
                studentTotal:'已到学生数，共0人',
                count: {
                    createUser: 0,
                    visit: 0,
                    collection: 0,
                    transfer: 0,
                    todayStudent:0
                }
            };
        },
        mounted() {
            this.init();
        },
        methods: {
            init() {
                stat().then(json => {
                    if (json.code == 0) {
                        const countInfo = json.data;
                        this.staffTotal = '已到员工数，共' + countInfo.staff_count + '人';
                        this.count.createUser = countInfo.today_staff;
                        this.count.visit = countInfo.today_total;
                        this.count.collection = countInfo.today_guest;
                        this.count.transfer = countInfo.today_stranger;

                        this.studentTotal = '已到学生数，共' + countInfo.student_count + '人';
                        this.count.todayStudent = countInfo.today_student;
                    }
                });
            }
        }
    };
</script>
